import { Layout, Button, Typography, Divider, message } from 'antd';
import { useState } from 'react';
import { categoryManagement } from '../../../../apis/auth';

const { Header } = Layout;
const { Title, Text } = Typography;

const ProductCategory2 = () => {
    const [loading, setLoading] = useState(false);
//     const [popularity, setPopularity] = useState(0);
//     const [commodityName, setCommodityName] = useState('');
//    const [ca]
    const addCategory = async () => {
        setLoading(true);
        try {
            const response = await categoryManagement.addCategory();
            if (response.data.code === 200) {
                message.success(response.data.message);
            } else {
                message.error('新增商品分类失败');
            }
        } catch (error) {
            message.error('新增商品分类失败');
        } finally {
            setLoading(false);
        }
    };

    return (
        <Layout>
            <Header style={{
                background: '#fff',
                padding: '10px',
                display: 'flex',
                flexDirection: 'column', // 垂直排列
                alignItems: 'start',
                height: 'auto' // 使用 auto 确保自适应内容高度
            }}>
                <Divider style={{ margin: '1px 0', width: '100%' }} />
                <Title level={4} style={{ marginBottom: '0.5em', fontSize: '16px' }}>分类管理</Title>
                <Text style={{ fontSize: '12px', marginBottom: '8px' }}>
                    商品分类展示，新增分类，删除分类
                </Text>
                <Divider style={{ margin: '8px 0', width: '100%' }} /> {/* 添加分割线 */}
                <Button
                    type="primary"
                    onClick={addCategory}
                    loading={loading}
                >
                    新增分类
                </Button>
            </Header>
        </Layout>
    );
};

export default ProductCategory2;
